<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <meta name="author" content="PIXINVENT">
    <title>999后台管理系统</title>

    <script src="app-assets/js/Dream.js"></script>
    <script src="app-assets/js/Http.js"></script>
    <script src="app-assets/js/jquery.js"></script>
    <script src="app-assets/js/jquery.magnific-popup.js" type="text/javascript"></script>
    <link rel="stylesheet" href="app-assets/css/login.css">
    <link rel="stylesheet" href="app-assets/css/bootstrap.css">

    <link href="app-assets/css/popup-box.css" rel="stylesheet" type="text/css" media="all" />
</head>

<body>

    <section class="canvas-wrap">
        <div id="canvas" class="gradient"></div>
    </section>

    <div style="position:absolute; z-index:100;">

        <h1>999便利店后台管理系统</h1>
        <div class="w3layouts">
            <div class="signin-agile">
                <h2>用户登录</h2>
                <div>
                    <input type="text" name="name" id="name" placeholder="用户名" required="">
                    <input type="password" name="password" id="password" placeholder="Password" required="">
                    <div class="clear"></div>
                    <input style="margin-bottom: 20px" type="submit" value="登录" onclick="login()">
                </div>
            </div>
            <div class="signup-agileinfo">
                <h3>用户注册</h3>
                <p>Phasellus vel urna magna. Quisque molestie felis varius ex faucibus auctor. Aenean sit amet erat ullamcorper, condimentum odio in, commodo tellus.</p>
                <div class="more"> <a class="book popup-with-zoom-anim button-isi zoomIn animated" data-wow-delay=".5s" href="#small-dialog">现在注册</a> </div>
            </div>
            <div class="clear"></div>
        </div>
        <div class="footer-w3l">
            <p class="agileinfo">
                &copy; 2016 Sign In And Sign Up Forms . All Rights Reserved | Design by <a href="https://www.bootstrapmb.com">bootstrapMB</a>
            </p>
        </div>

    </div>



    <div class="pop-up">
        <div id="small-dialog" class="mfp-hide book-form">
            <h3>注册信息</h3>
            <div>
                <input type="text" id="loginName" name="Name" placeholder="用户名" required="" />
                <input type="text" id="empName" name="empName" placeholder="姓名" required="" />
                <input type="text" id="phoneNumber" name="phoneNumber" placeholder="联系电话" required="" />
                <input type="text" name="Email" id="email" class="email" placeholder="邮件地址" required="" />
                <input type="password" id="registerPassword" name="Password" class="password" placeholder="密码" required="" />
                <input type="password" id="password2" name="Password" class="password" placeholder="确认密码" required="" />
                <input type="submit" onclick="registerTo()" value="注册">
            </div>
        </div>
    </div>
    <script src="app-assets/bgjs/three.min.js"></script>
    <script src="app-assets/bgjs/projector.js"></script>
    <script src="app-assets/bgjs/canvas-renderer.js"></script>
    <script src="app-assets/bgjs/3d-lines-animation.js"></script>

    <script src="app-assets/bgjs/color.js"></script>

</body>
</html>
<script>

    $(document).ready(function () {

        $('.popup-with-zoom-anim').magnificPopup({

            type: 'inline',

            fixedContentPos: false,

            fixedBgPos: true,

            overflowY: 'auto',

            closeBtnInside: true,

            preloader: false,

            midClick: true,

            removalDelay: 300,

            mainClass: 'my-mfp-zoom-in'

        });


    });
    
    function registerTo() {
        let loginName = $("#loginName").val()
        let empName = $("#empName").val()
        let phoneNumber = $("#phoneNumber").val()
        let email = $("#email").val()
        let registerPassword = $("#registerPassword").val()
        let password2 = $("#password2").val()
        if (verify(loginName,registerPassword,password2,empName,phoneNumber,email)) {
            $.ajax({
                'url': HTTP.getUserInfo+'/employees/register',
                'type': 'post',
                'dataType': 'json',
                'contentType': 'application/json',
                'data': JSON.stringify({loginName,empName,phoneNumber,email,registerPassword}),
                'success': registerSuccess
            })
        }
    }
    function registerSuccess(data) {
        if (data.code == 200){
            Dreamer.success("注册成功！",1000,function (){
                window.location.href = "/index.html"
            })

        }else {
            Dreamer.error(data.message,1000)
        }
    }

    function verify(loginName,password,password2,empName,phoneNumber,email){
        if (loginName === ""){
            Dreamer.error("用户名不能为空！",1000);
            return false;
        }

        if (empName === ""){
            Dreamer.error("姓名不能为空！",1000);
            return false;
        }
        if (phoneNumber === ""){
            Dreamer.error("联系电话不能为空！",1000);
            return false;
        }

        if (phoneNumber.length != 11){
            Dreamer.error("联系电话长度不正确！",1000);
            return false;
        }
        if (email === ""){
            Dreamer.error("邮件地址不能为空！",1000);
            return false;
        }

        if (email.indexOf("@") == -1){
            Dreamer.error("邮件地址格式不正确！",1000);
            return false;
        }

        if (email.indexOf(".") == -1){
            Dreamer.error("邮件地址格式不正确！",1000);
            return false;
        }
        if (password  === ""){
            Dreamer.error("密码不能为空！",1000);
            return false;
        }
        if (password2  === ""){
            Dreamer.error("确认密码不能为空！",1000);
            return false;
        }
        if (password != password2){
            Dreamer.error("两次输入的密码不一致！",1000);
            return false;
        }
        return true;
    }
    
    function login() {
        let username = $("#name").val()
        let password = $("#password").val()
        if (verify2(username,password)) {
            $.ajax({
                'url':  HTTP.getUserInfo+'/employees/login',
                'type': 'post',
                'dataType': 'json',
                'contentType': 'application/json',
                'data': JSON.stringify({username,password}),
                'success': loginSuccess
            })
        }
    }
    function loginSuccess(data) {
        console.log(data)
        if (data.code == 200){
            sessionStorage.clear()
            sessionStorage.setItem("empName",data.data.empName)
            sessionStorage.setItem("loginName",data.data.loginName)
            sessionStorage.setItem("password",data.data.password)
            sessionStorage.setItem("position",data.data.position)
            sessionStorage.setItem("email",data.data.email)
            sessionStorage.setItem("phoneNumber",data.data.phoneNumber)
            sessionStorage.setItem("employeeId",data.data.employeeId)
            Dreamer.success("登录成功！",1000,function (){
                window.location.href = "../default.html"
            })
        }else {
            Dreamer.error(data.message,1000)
        }
    }
    function verify2(loginName, password) {
        if (loginName === ""){
            Dreamer.error("用户名不能为空！",1000);
            return false;
        }
        if (password  === ""){
            Dreamer.error("密码不能为空！",1000);
            return false;
        }
        return true;
    }
</script>